<template>
    <view style="padding: 15px;">
        <u-form ref="validateFormRef" :model="validateForm.value" :label-width="150">
            <u-form-item label="原始密码" prop="rawPassword" required
                         v-if="toValue('globalVariable.userInfo.allowAlterFields', globalVariable, '').indexOf('password') === -1">
                <u-input type="password" v-model="validateForm.value.rawPassword" placeholder="请输入原始密码"/>
            </u-form-item>
            <u-form-item label="新的密码" prop="password" required>
                <u-input type="password" v-model="validateForm.value.password" placeholder="请输入新的密码"/>
            </u-form-item>
            <u-form-item label="确认密码" prop="confirmPassword" required>
                <u-input type="password" v-model="validateForm.value.confirmPassword" placeholder="请输入确认密码"/>
            </u-form-item>
        </u-form>

        <u-button type="error" @click="submit">确认修改</u-button>
    </view>
</template>

<script>

    import {SysUserService} from "@/dev/services/sys-user.service";
    import {CommonUtil} from "@/dev/core/utils/common.util";
    import {UFormUtil} from "@/dev/core/utils/u-form.util";
    import {LocalStorageUtil} from "@/dev/core/utils/local-storage.util";

    export default {
        data() {
            return {
                validateForm: {
                    value: {
                        id: this.globalVariable.userInfo.id,
                        rawPassword: '',
                        password: '',
                        confirmPassword: '',
                        allowAlterFields: this.globalVariable.userInfo.allowAlterFields.replace('password', 'PASSWORD已修改')
                    },
                    rules: {
                        rawPassword: [
                            {required: true, message: '请输入新的密码!', trigger: ['change', 'blur']},
                            {pattern: /^(?=.*\S).+$/, message: '请输入新的密码!', trigger: ['change', 'blur']},
                            {pattern: /^(?=.*\S).+$/, message: '请输入原始密码!', trigger: ['change', 'blur']},
                            {
                                trigger: ['blur'],
                                asyncValidator: (rule, value, callback) => {
                                    new SysUserService().validRawPassword({id: this.validateForm.value.id, password: value}).then(result => {
                                        if (result.status === 'success') {
                                            callback()
                                        } else {
                                            callback(new Error('输入的原始密码不正确！'))
                                        }
                                    })
                                }
                            }
                        ],
                        password: [
                            {required: true, message: '请输入新的密码!', trigger: ['change', 'blur']},
                            {pattern: /^(?=.*\S).+$/, message: '请输入新的密码!', trigger: ['change', 'blur']},
                            {
                                trigger: ['blur'],
                                asyncValidator: (rule, value, callback) => {
                                    console.log(rule, value, callback)
                                    if (this.validateForm.value.confirmPassword) {
                                        UFormUtil.validation(this.$refs.validateFormRef, 'confirmPassword');
                                    }
                                    callback();
                                }
                            }
                        ],
                        confirmPassword: [
                            {required: true, message: '请输入确认密码!', trigger: ['change', 'blur']},
                            {pattern: /^(?=.*\S).+$/, message: '请输入确认密码!', trigger: ['change', 'blur']},
                            {
                                trigger: ['blur'],
                                asyncValidator: (rule, value, callback) => {
                                    console.log(rule, value, callback)
                                    if (value !== this.validateForm.value.password) {
                                        callback(new Error('两次输入密码不一致！'))
                                    } else {
                                        callback()
                                    }
                                }
                            }
                        ]
                    }
                }
            }
        },
        onLoad(options) {
            const _self = this

        },
        methods: {
            submit() {
                const _self = this;
                this.$refs.validateFormRef.validate(valid => {
                    if (valid) {
                        console.log('验证通过', _self.validateForm.value);
                        CommonUtil.alert({
                            title: '提示！',
                            content: '确认提交吗？',
                            showCancel: true, // 是否显示取消按钮
                            success: function (res) {
                                if (res.cancel) { // 点击取消,默认隐藏弹框
                                } else { // 点击确定
                                    new SysUserService().updatePassword(_self.validateForm.value).then(result => {
                                        Object.assign(_self.globalVariable.userInfo, CommonUtil.deleteNullAttrInObject(result));
                                        LocalStorageUtil.setItem("userInfo", _self.globalVariable.userInfo);
                                        CommonUtil.toastNavigateBack('修改成功')
                                    })
                                }
                            }
                        });
                    } else {
                        console.log('验证失败');
                    }
                });
            }
        }
    }
</script>

<style lang="scss" scoped>
</style>
